<template>
    <div id="app">
		<!-- <router-view/> -->
		<keep-alive>
            <router-view v-if="$route.meta.keepAlive&&isRouterAlive"></router-view>
        </keep-alive>
        <router-view  v-if="!$route.meta.keepAlive&&isRouterAlive"></router-view>
    </div>
</template>

<script>

export default {
	name: 'app',
    components: {},
    provide () {    //父组件中通过provide来提供变量，在子组件中通过inject来注入变量。                                             
        return {
            reload: this.reload                                              
        }
    },
    data() {
        return{
            isRouterAlive: true                    //控制视图是否显示的变量
        }
    },
    methods: {
        reload () {
            this.isRouterAlive = false;            //先关闭，
            this.$nextTick(function () {
                this.isRouterAlive = true;         //再打开
            }) 
        }
    }
}
</script>

<style>
    body {
        /* filter: grayscale(1); */
    }
	/* reset */
    *{word-wrap: break-word;}
    *,*:before,*:after{box-sizing: border-box;outline: none;}
    html{min-width: 1250px; overflow-x: auto;}
    html, body, h1, h2, h3, h4, h5, h6, hr, p, iframe, dl, dt, dd, ul, ol, li, pre, form, button, input, textarea, th, td, fieldset{margin: 0; padding: 0; font-weight: normal; -webkit-tap-highlight-color: transparent;}
    ul, ol, dl{list-style-type: none;}
    html, body{*position: static; color: #000; background: #fff; width: 100%; height: auto;}
    input, button, textarea, select, optgroup, option{font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit;}
    input, button{overflow: visible; vertical-align: middle; outline: none;}
    body, th, td, button, input, select, textarea{font-size: 12px;font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
    h1, h2, h3, h4, h5, h6{font-size: 100%;}
    a{text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent; -webkit-transition: all .3s ; transition: all .3s; color: #000;}
    a:hover, a:focus, a:active{text-decoration: none; outline: none;}
    a.ie6:hover{zoom: 1;}
    b, i{font-weight: normal; font-style: normal;}
    sub, sup{vertical-align: baseline;}
    button, input[type="button"], input[type="submit"]{line-height: normal !important;}
    img{border: 0;}
    a img, img{-ms-interpolation-mode: bicubic; -webkit-transition: all .3s; transition: all .3s; display: block; max-width: 100%;object-fit: cover}
    /* HTML5 reset */
    header, footer, section, aside, details, menu, article, section, nav, address, hgroup, figure, figcaption, legend{display: block; margin: 0; padding: 0;}
    time{display: inline;}
    audio, canvas, video{display: inline-block; *display: inline; *zoom: 1;}
    audio:not([controls]){display: none;}
    legend{width: 100%; margin-bottom: 20px; font-size: 21px; line-height: 40px; border: 0; border-bottom: 1px solid #e5e5e5;}
    legend small{font-size: 15px; color: #999;}
    svg:not(:root){overflow: hidden;}
    fieldset{border-width: 0; padding: .35em .625em .75em; margin: 0 2px; border: 1px solid #c0c0c0;}
    input, textarea,button{outline: none; resize: none;    border: none;background: transparent;}
    input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button{height: auto;}
    input[type="search"]{-webkit-appearance: textfield; -webkit-box-sizing: content-box; box-sizing: content-box;}
    input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration{-webkit-appearance: none;}
    input[type="text"], input[type="tel"], input[type="button"], input[type="submit"], input[type="reset"], input[type="password"], input[type="email"], textarea{-webkit-appearance: none; border-radius: 0; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
    input::-webkit-outer-spin-button, input::-webkit-inner-spin-button{-webkit-appearance: none !important; margin: 0;}
    input::placeholder, textarea::placeholder{color: #C0C4CC;}
    input::-moz-placeholder, textarea::-moz-placeholder{color: #C0C4CC;}
    input:-ms-input-placeholder, textarea:-ms-input-placeholder{color: #C0C4CC;}
    input::-webkit-input-placeholder, textarea::-webkit-input-placeholder{color: #C0C4CC;}
    ::-webkit-scrollbar{width: 12px;height: 8px}
    ::-webkit-scrollbar-track{background: rgba(144, 147, 153, 0.1)}
    ::-webkit-scrollbar-track:hover{background: rgba(144, 147, 153, 0.1)}
    ::-webkit-scrollbar-thumb{border-radius: 0;background: rgba(144, 147, 153, 0.3);}
    ::-webkit-scrollbar-thumb:hover{background: rgba(144, 147, 153, 0.5)}
    ::-webkit-scrollbar-corner{background: 3px 3px}
	/* common */
    .iconfont{font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale;}
    .cl:after, .clearfix:after{content: ""; display: block; height: 0; clear: both; visibility: hidden;}
    .cl, .clearfix{zoom: 1;clear: both;}
    .fl{float: left;}
    .fr{float: right;}
    .w1200{width: 1200px; margin: 0 auto; position: relative;}
    .el-cascader__dropdown{border-radius: 0 !important;}
    .el-popup-parent--hidden{padding: 0 !important}
    .el-dialog__body{padding-top: 10px !important}
    .el-pagination{text-align: center;margin: 40px 0;}
    .el-pagination.is-background .btn-prev, .el-pagination.is-background .btn-next, .el-pagination.is-background .el-pager li{background-color: #fff !important;}
    .el-pagination.is-background .el-pager li:not(.disabled).active{background: #E54437 !important;}
    .el-popconfirm__main{margin: 5px 0 10px}
    .el-cascader__empty-text{padding: 0 15px}
    .main{position: relative;z-index: 0;}
    #app{height: 100%;}
</style>
